<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <!--根据设计图 的媒体查询 单位像素-->
   <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
   <meta name="screen-orientation" content="portrait"><!-- uc强制竖屏 -->
   <meta name="x5-orientation" content="portrait"><!-- QQ强制竖屏 -->
   <meta name="apple-mobile-web-app-capable" content="no"/><!-- 是否启用 WebApp 全屏模式，删除苹果默认的工具栏和菜单栏 -->
   <title>活动详情</title>
   <link rel="stylesheet" href="__HOME__/css/font-size.min.css">
   <link rel="stylesheet" href="__HOME__/css/style.css">
</head>
<body>
<div class="banner">
   <img src="{$info.imgurl}" alt="" >
</div>
<div class="activities">
   <div class="com_width">
      <h3 class="title">活动介绍：</h3>
      <p class="text">
         {$info.content}
      </p>
      <div class="date">活动时间：<span class="text-red">{$info.starttime}至{$info.endtime}</span></div>
      <div class="type">活动类型：<span>{if $info.type_id==1}未成年人{elseif $info.type_id==2}成年人{else}家庭{/if}</span></div>
      <div class="residue">剩余名额：<span>{$info.signnum}</span></div>
   </div>
</div>
<div class="forms">
   <div class="container">
      <form class="com_width">
         <div class="row">
            <label class="text">您的姓名<span class="icon">*</span></label>
            <input id="username" type="text" placeholder="请输入姓名" value="" required="required" />
         </div>
         {if $info.type_id==1}
         <div class="row">
            <label class="text">所在学校<span class="icon">*</span></label>
            <input id="childname" type="text" placeholder="请输入学校" value="" required="required" />
         </div>
         {else}
         <input id="childname" type="hidden" value="">
         {/if}
         <div class="row">
            <label class="text">联系电话<span class="icon">*</span></label>
            <input id="tel" type="tel" name="tel" placeholder="请输入电话" value="" required="required" />
         </div>
         <div class="row">
            <label class="text">手机验证<span class="icon">*</span></label>
            <input id="code" class="code" type="text" placeholder="请输入验证码" value="" required="required" />
            <button class="code-btn" type="button">获取验证码</button>
         </div>
         <style>
            .code {width: 200px !important;display:inline;}
            .code-btn {display:inline;float:right;color: #3f3fa5; background-color: #9e9eb3; padding:0px 10px; height: 32px; line-height:30px; color:#fff; background:#ef4f4f; margin-top:5px; border-radius: 5px;}
         </style>
      </form>
   </div>
   <input id="ac_id" type="hidden" value="{$info.activity_id}">
   <a class="submit-btn com_width">立即报名</a>
</div>
</body>
<script src="__HOME__/js/jquery-1.9.1.min.js"></script>
<script src="__HOME__/js/ibox.js"></script>
<script>
   $('img').error(function(){
      $(this).attr('src', "__HOME__/images/error_logo.png").css('background','transparent');
   });
   //验证码
   var flag = true;
   $(".code-btn").click(function(){
       if(flag != true)
            return false;
		var mobile = $("#tel").val();
		var _self = $(this);
		if( mobile == '' ) {
            iBox.error('手机号不能为空',3000);
			return false;
		}
		var reg_mobile = /^1[3-9][0-9]{9}$/;
		if( !reg_mobile.test(mobile)){
            iBox.error('手机号格式错误',3000);
			return false;
		}
       flag = false;
		$.post("{:url('index/sendSms')}" , { mobile : mobile } , function(data){
			if( data.status == 1 ) {
				var send_time = 60;
				var time_flat = setInterval(function(){
					send_time--;
					_self.text(send_time + "s后重发");
					if( send_time <= 0 ) {
                        flag = true;
						clearInterval(time_flat);
						_self.text("重新发送");
					}
				},1000);
				$("#code").val( data.smscode );
                iBox.success('发送成功，请注意查收',3000);
			} else {
                flag = true;
                iBox.error('发送失败，请重试！',3000);
			}
		},"json");
   });
   //报名
   $('.submit-btn').click(function () {
       var id = $('#ac_id').val();
       var username = $('#username').val();
       var childname = $('#childname').val();
       var tel = $('#tel').val();
       var code = $('#code').val();
       if (id==''){
           iBox.error('错误！！',3000);return false;
       }
       if (username==''){
           iBox.error('请输入你的名字',3000);return false;
       }
       if (tel==''){
           iBox.error('请输入电话号码',3000);return false;
       }
       if (code==''){
           iBox.error('请输入验证码',3000);return false;
       }
       $.ajax({
           url:"{:url('index/signup')}",
           type:"post",
           data:{id:id,username:username,childname:childname,tel:tel,code:code},
           success:function(data){
		   console.log(data);
               data = eval('('+data+')');
			   console.log(data);
               if (data.code==1){
			   
                   iBox.success(data.msg,3000);

                   setTimeout(
                       function(){
                           window.location.href="{:url('index/listmy')}"+"?tel="+tel;
                           },3000
                   );
               }else {
                   iBox.alert(data.msg)
               }
           },
       });
   });
</script>
</html>